﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Messages.aspx.cs" Inherits="FlashGameSite.FormMessages" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
    <script type="text/javascript">
        function ClearText() {
            document.getElementById('<%=txtMessageTo.ClientID %>').innerHTML = "";
            document.getElementById('txtInput').value = "";
            document.getElementById('<%=txtMessageText.ClientID %>').value = "";
            document.getElementById('txtInput').disabled = false;
        }

        $(function () {
            $("#txtInput").autocomplete({
                source: function (request, response) {
                    $.ajax({
                        url: "GameService.asmx/GetProfiles",
                        data: "{ 'tag': '" + document.getElementById('txtInput').value + "' }",
                        dataType: "json",
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        dataFilter: function (data) { return data; },
                        success: function (data) {
                            response($.map(jQuery.parseJSON(data.d), function (item) {
                                return {
                                    label: '<strong id="selectUser" pid="' + item.UserID + '" style="color:Black;">' + item.Name + '</strong>',
                                    value: item.Name
                                }
                            }))
                        },
                        error: function (XMLHttpRequest, textStatus, errorThrown) {
                            //alert(textStatus);
                        }
                    });
                },
                minLength: 3,
                select: function (event, ui) {
                    document.getElementById('<%=txtMessageTo.ClientID %>').innerHTML = ui.item.label;
                    document.getElementById('txtInput').disabled = true;
                }
            });
        });

            $(document).ready(function () {
                $("#btnSend").click(function () {
                    var validPage = true;
                    if (document.getElementById('<%=txtMessageTo.ClientID %>').innerText == "") {
                        validPage = false;
                    }
                    if (document.getElementById('<%=txtMessageText.ClientID %>').innerText == "") {
                        validPage = false;
                    }

                    if (!validPage) {
                        alert("Please select user and enter message to send.");
                        return;
                    }

                    var userId = document.getElementById("selectUser").attributes.getNamedItem("pid").value;

                    $.ajax({
                        type: "POST",
                        url: "GameService.asmx/SendMessage",
                        data: "{'input':'" + userId + "','message':'" + document.getElementById('<%=txtMessageText.ClientID %>').value + "'}",
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success: function (msg) {
                            // Replace the div's content with the page method's return.
                            ClearText();
                            alert("Message sent!");
                        }
                    });
                });
            });
    </script>
    <div id="content">
        <div class="block">
            <div class="block-bot">
                <div class="head">
                    <div class="head-cnt">
                        <h3>My Messages</h3>
                        <div class="cl">
                        </div>
                    </div>
                </div>
            </div>
            <table style="width: 500px; margin: 10px; height: 160px;">
                <tr>
                    <td>
                        <label>Message To</label></td>
                    <td>
                        <input id="txtInput" type="text" class="txtcls" /><img src="css/images/clearicon.png" title="Remove user" onclick="ClearText();" />
                        <div id="txtMessageTo" runat="server" enableviewstate="true" style="display: none; border: 1px solid grey; width: 280px; font-size: 12px; text-align: left;">
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label>Message</label></td>
                    <td>
                        <asp:TextBox ID="txtMessageText" TextMode="MultiLine" CssClass="txtcls" runat="server" Height="70px"></asp:TextBox></td>
                </tr>
                <tr>
                    <td colspan="2">
                        <input id="btnSend" type="button" style="float: right;" value="Send" class="btncls" />
                    </td>
                </tr>
            </table>
            <hr />
            <asp:UpdatePanel ID="pnlMessages" runat="server" UpdateMode="Always">
                <ContentTemplate>
                    <asp:DataList ID="GridMessages" Width="100%" runat="server">
                        <ItemTemplate>
                            <div style="border: 1px dashed grey; padding: 10px;">
                                <h3>Conversation with <a style="font-weight: bold;" href="MessageConv.aspx?convid=<%# DataBinder.Eval(Container.DataItem, "MessageGuid")%>"><%# DataBinder.Eval(Container.DataItem, "ToUserName")%></a></h3>
                                Last Message: <strong><%# DataBinder.Eval(Container.DataItem, "LastMessage")%></strong>

                                <asp:ImageButton Style="float: right;" ID="imgDelete" MessageID='<%# DataBinder.Eval(Container.DataItem, "MessageGuid")%>' ImageUrl="~/css/images/delete-mail.png" ToolTip="Delete message" runat="server" OnClientClick="return confirm('Are you sure want to delete this conversation?');" OnClick="imgDelete_Click" />
                                <a style="float: right;" href="MessageConv.aspx?convid=<%# DataBinder.Eval(Container.DataItem, "MessageGuid")%>" title="View message">
                                    <img src="css/images/open-mail.png" />
                                </a>
                            </div>
                        </ItemTemplate>
                    </asp:DataList>
                </ContentTemplate>
            </asp:UpdatePanel>
            <br />
        </div>

    </div>
</asp:Content>
